<template>
  <a-modal
    @cancel="cancel"
    centered
    v-model="visible"
    title="入库审核"
    width="85%"
  >
    <template slot="footer">
      <a-button
        v-if="viewBtnFlag != 'pass' && viewBtnFlag != 'read'"
        @click="cancel"
        style="background: #d7d7d7; color: #fff; border: none"
        >关闭</a-button
      >
      <a-button
        v-if="viewBtnFlag === 'pass' || viewBtnFlag === 'read'"
        :loading="refuseLogin"
        @click="chcekBtn('reject')"
        style="background: #f00; color: #fff; border: none"
        >拒绝</a-button
      >
      <a-button
        v-if="
          (viewBtnFlag === 'pass' && this.tabKeys == '10') ||
          (this.tabKeys == '20' && this.dto.distributionTypeId)
        "
        :loading="loading"
        type="primary"
        @click="chcekBtn('pass')"
        >审核通过</a-button
      >
      <a-button
        v-if="this.dto.applyState === '100' && viewBtnFlag === 'finance'"
        :loading="loading"
        type="primary"
        @click="sendBill"
        >发送账单</a-button
      >
    </template>

    <h3>装箱明细</h3>
    <a-form-model
      style="margin-bottom: 10px"
      ref="addForm"
      :rules="addFormRules"
      :model="addFormData"
      layout="inline"
    >
      <a-form-model-item
        style="margin-right: 15px"
        label="入库仓库："
        prop="warehousingId"
      >
        <a-select
          :disabled="modalFlage == 'look' || tabKeys == '20'"
          show-search
          option-filter-prop="children"
          style="width: 200px"
          placeholder="未选择"
          :filter-option="filterOption"
          @change="changeWarehouse"
          v-model="addFormData.warehousingId"
        >
          <a-select-option
            :value="item.warehouseId"
            v-for="item in clientWareHouse"
            :key="item.warehouseId"
            :name="item.titleName"
          >
            {{ item.titleName }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="清点类型：" prop="countingTypeId">
        <a-select
          :disabled="modalFlage == 'look' || tabKeys == '20'"
          ref="warehousing"
          show-search
          option-filter-prop="children"
          placeholder="未选择"
          style="width: 200px"
          :filter-option="filterOption"
          @change="changeCountingType"
          v-model="addFormData.countingTypeId"
        >
          <a-select-option
            defaultValue="全部"
            :value="item.key"
            v-for="item in checkTypes"
            :key="item.key"
            :name="item.title"
          >
            {{ item.title }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
    </a-form-model>
    <!-- 表格 -->
    <a-table
      size="small"
      bordered
      :data-source="dataSource"
      :pagination="false"
      :scroll="{ x: 1280, y: 250 }"
    >
      <!-- 箱子编号 -->
      <a-table-column key="boxNo" data-index="boxNo" align="center" width="5%">
        <span slot="title"> 箱子编号</span>
        <template slot-scope="text, record">
          {{ record.boxNo }}
        </template>
      </a-table-column>
      <!-- 自定义编号 -->
      <a-table-column
        key="customNo"
        data-index="customNo"
        align="center"
        width="6%"
      >
        <span slot="title">自定义编号</span>
        <template slot-scope="text, record">
          <a-input
            :maxLength="128"
            v-if="modalFlage != 'look' && tabKeys != '20'"
            size="small"
            style="width: 6rem"
            v-model="record.customNo"
          />
          <span v-else>{{
            record.customNo === "" || record.customNo === null
              ? "暂无"
              : record.customNo
          }}</span>
        </template>
      </a-table-column>
      <!-- sku信息 -->
      <a-table-column
        key="boxlist"
        class="columns-tab"
        data-index="boxlist"
        align="center"
        width="50%"
      >
        <div slot="title" class="columns">
          <div style="width: 16%">商品名称</div>
          <div style="width: 16%">商品SKU</div>
          <div style="width: 9%">标签</div>
          <div style="width: 9%">预报数量/箱</div>
          <div style="width: 50%">SKU核重 : 长*宽*高（cm）；重量（g）</div>
        </div>
        <!-- 表格 -->
        <template slot-scope="text, record">
          <ul class="pto-list" v-for="item in record.pto" :key="item.key">
            <li style="width: 16%">
              <span>
                {{ item.skuName }}
              </span>
            </li>
            <li style="width: 16%">
              <span>
                {{ item.sku }}
              </span>
            </li>
            <li style="width: 9%">
              <span>
                <a
                  href="javascript:;"
                  style="color: #3e3ee3; border-bottom: 1px solid #3e3ee3"
                  @click="tagDownload(item)"
                  >{{ item.productTag }}</a
                >
              </span>
            </li>
            <li style="width: 9%">
              <span>
                {{ item.singleBoxNumber }}
              </span>
            </li>
            <li
              style="width: 50%; display: flex; justify-content: space-around"
            >
              <div>
                <span> 尺寸： </span>
                <span> {{ item.skuLengthNumber }}* </span>
                <span> {{ item.skuWideNumber }}* </span>
                <span>
                  {{ item.skuHighNumber }}
                </span>
              </div>
              <div>
                重量：
                <span> {{ item.skuCaratNumber }} </span>
              </div>
              <div :class="item.nuclide ? 'nuclide' : 'nonuclide'">
                <span>
                  {{ item.nuclide ? "已核重" : "未核重" }}
                </span>
              </div>
            </li>
          </ul>
        </template>
      </a-table-column>

      <!-- 重量 -->
      <a-table-column
        key="caratNumber"
        data-index="caratNumber"
        align="center"
        width="10%"
      >
        <span slot="title">箱子尺寸/重量(cm/kg)</span>
        <template slot-scope="text, record">
          <div style="text-align: left">
            <div style="margin-bottom: 10px">
              <span> 尺寸： </span>
              <span>{{ record.lengthNumber }}*</span>
              <span>{{ record.wideNumber }}*</span>
              <span>{{ record.highNumber }}</span>
            </div>
            <div>
              <span> 重量： </span>
              <span>
                {{ record.caratNumber }}
              </span>
            </div>
          </div>
        </template>
      </a-table-column>
      <!-- 装箱数量 -->
      <a-table-column
        key="packingNumber"
        data-index="packingNumber"
        align="center"
        width="8%"
      >
        <span slot="title"> <span style="color: red">*</span>预报箱数</span>
        <template slot-scope="text, record">
          <a-input
            :maxLength="128"
            v-if="modalFlage != 'look' && tabKeys != '20'"
            @keyup="
              record.packingNumber = record.packingNumber.replace(
                /[^\d\.]/g,
                ''
              )
            "
            size="small"
            style="width: 4rem"
            v-model="record.packingNumber"
            :style="
              record.packingNumber <= 0 || record.packingNumber === undefined
                ? styleBack
                : styleYes
            "
          />
          <span v-else>
            {{ record.packingNumber }}
          </span>
        </template>
      </a-table-column>
    </a-table>
    <h3 style="margin-top: 20px">入库方式</h3>
    <div class="logistics">
      <!-- <span style="color: red">注：选择物流信息后，头程信息为必填项！</span> -->
      <a-form-model
        ref="ruleForm"
        :model="dto"
        class="logi-form"
        :rules="rules"
      >
        <a-form-model-item label="入库方式" prop="distributionTypeId">
          <a-select
            show-search
            :disabled="modalFlage == 'look'"
            placeholder="未选择"
            style="width: 200px"
            option-filter-prop="children"
            :filter-option="filterOption"
            @change="changeDistributionType"
            v-model="dto.distributionTypeId"
          >
            <a-select-option
              :value="item.key"
              v-for="item in this.express"
              :key="item.key"
              :name="item.title"
            >
              {{ item.title }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <!-- 发出方 -->
        <a-form-model-item label="发出方：" prop="shipperId">
          <a-select
            :disabled="modalFlage == 'look'"
            ref="warehousing"
            show-search
            placeholder="未选择"
            option-filter-prop="children"
            style="width: 200px"
            :filter-option="filterOption"
            @change="changeSendOut"
            v-model="dto.shipperId"
          >
            <a-select-option
              :value="item.key"
              v-for="item in this.sendOuts"
              :key="item.key"
              :name="item.title"
            >
              {{ item.title }}
            </a-select-option>
          </a-select>
        </a-form-model-item>

        <!-- 发货时间 -->
        <a-form-model-item label="发货时间：" prop="startTime">
          <a-date-picker
            :disabled="modalFlage == 'look'"
            style="width: 200px"
            format="YYYY-MM-DD"
            @change="changeExpressTime"
            v-model="dto.startTime"
          />
        </a-form-model-item>
        <!-- 预计到仓时间： -->
        <a-form-model-item prop="whtEndTime" label="预计到仓时间：">
          <a-date-picker
            :disabled="modalFlage == 'look'"
            format="YYYY-MM-DD"
            v-model="dto.whtEndTime"
            style="width: 200px"
            @change="changeEndTime"
          />
        </a-form-model-item>

        <!-- 散货（箱）-快递 -->

        <!-- 发货物流名称 -->
        <a-form-model-item
          label="发货物流名称："
          prop="logisticsId"
          v-if="dto.distributionTypeId == '10319'"
        >
          <a-select
            :disabled="modalFlage == 'look'"
            ref="warehousing"
            show-search
            placeholder="未选择"
            option-filter-prop="children"
            style="width: 200px"
            :filter-option="filterOption"
            @change="changeLogisticsName"
            v-model="dto.logisticsId"
          >
            <a-select-option
              :value="item.key"
              v-for="item in logisSelect"
              :key="item.key"
              :name="item.title"
            >
              {{ item.title }}
            </a-select-option>
          </a-select>
        </a-form-model-item>

        <!-- 发货物流单号 -->
        <a-form-model-item
          label="发货物流单号："
          prop="expressNo"
          v-if="dto.distributionTypeId == '10319'"
        >
          <a-input
            :disabled="modalFlage == 'look'"
            placeholder="发货物流单号"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.expressNo"
          />
        </a-form-model-item>

        <!-- 托盘-仓库安排 -->

        <!-- 托盘数量 -->
        <a-form-model-item
          class="upfile"
          prop="trayNumber"
          label="托盘数量："
          v-if="
            dto.distributionTypeId == '10320' ||
            dto.distributionTypeId == '10321'
          "
        >
          <a-input-number
            :disabled="modalFlage == 'look'"
            placeholder="托盘数量"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.trayNumber"
          />
          <span style="color: #bfbfbf"
            >注：若暂无托盘数量，请填写预估数量，实际将以仓库提/收货托盘数量为准。</span
          >
        </a-form-model-item>

        <a-form-model-item
          label="货运柜号："
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
          prop="cargotankNumber"
        >
          <a-input
            :disabled="modalFlage == 'look'"
            placeholder="货运柜号"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.cargotankNumber"
          />
        </a-form-model-item>
        <a-form-model-item
          label="货柜型号："
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
          prop="cargotankModel"
        >
          <a-input
            :disabled="modalFlage == 'look'"
            placeholder="货柜型号"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.cargotankModel"
          />
        </a-form-model-item>
        <a-form-model-item
          label="是否带托盘："
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
          prop="isTora"
        >
          <a-radio-group v-model="dto.isTora" :disabled="modalFlage == 'look'">
            <a-radio :value="'1'"> 是 </a-radio>
            <a-radio :value="'0'"> 否 </a-radio>
          </a-radio-group>
        </a-form-model-item>
        <a-form-model-item
          label="HBL："
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
          prop="hbl"
        >
          <a-input
            :disabled="modalFlage == 'look'"
            placeholder="HBL"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.hbl"
          />
        </a-form-model-item>
        <a-form-model-item
          label="MBL："
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
          prop="mbl"
        >
          <a-input
            :disabled="modalFlage == 'look'"
            placeholder="MBL"
            :maxLength="128"
            style="width: 200px"
            v-model="dto.mbl"
          />
        </a-form-model-item>

        <!-- 要求还柜时间 -->
        <a-form-model-item
          label="要求还柜时间："
          prop="cabinetTime"
          v-if="
            dto.distributionTypeId == '10322' ||
            dto.distributionTypeId == '10323'
          "
        >
          <a-date-picker
            :disabled="modalFlage == 'look'"
            style="width: 200px"
            format="YYYY-MM-DD"
            @change="changeCabinetTime"
            v-model="dto.cabinetTime"
          />
        </a-form-model-item>

        <!-- 文件上传 -->
        <a-form-model-item
          class="upfile"
          prop="trayNumber"
          label="相关文件："
          v-if="
            dto.distributionTypeId == '10320' ||
            dto.distributionTypeId == '10322'
          "
        >
          <span
            v-if="dto.sinceFile != '' && dto.sinceFile != null"
            style="margin-right: 10px"
          >
            <a
              style="
                line-height: 32px;
                color: #2929e0;
                text-decoration: underline;
              "
              :href="dto.sinceFile"
              target="_blank"
              >查看已上传文件</a
            >
            <a-icon
              v-if="modalFlage != 'look'"
              @click="delFlie"
              style="cursor: pointer; color: #e8e8e8; margin-left: 5px"
              type="delete"
              theme="filled"
            />
          </span>
          <a-upload
            v-if="modalFlage != 'look'"
            :beforeUpload="beforeUploads"
            name="file"
            :action="baseUrl + '/by-file/uploadFile'"
            :headers="headers"
            @change="handle"
            :showUploadList="false"
            :file-list="logiFileList"
          >
            <a-button> <a-icon type="upload" /> 上传文件 </a-button>
            <span style="color: #f00; margin-left: 10px"
              >注：
              仓库安排自提需提供相关文件(只能上传PDF、JPEG/PNG格式文件！)</span
            >
          </a-upload>
        </a-form-model-item>
      </a-form-model>
    </div>
    <!-- 备注 -->
    <h3 style="margin-top: 20px">备注信息</h3>
    <a-textarea
      :disabled="modalFlage == 'look'"
      :maxLength="256"
      style="width: 90%"
      v-model="dto.remark"
      :auto-size="{ minRows: 2 }"
    />
  </a-modal>
</template>

<script>
import baseUrl from "@/utils/baseUrl";
import {
  treeTagDictionary,
  sku_select,
  removefile,
  SKU_PDF6030,
} from "@/apis/common";
import { getByApplyId, upDow } from "@/apis/clientSide/OrderManage/Instock";
import { behalf_stock } from "@/apis/system/InOrder/OneInStorages";

import { checkedByApplyInfo } from "@/apis/system/auditCenter/IsCheck";
import req from "@/utils/req";
import { mapState } from "vuex";
export default {
  props: ["tabData", "getTabData", "typeCount", "IsCheckTypeCount", "tabKeys"],
  created() {
    this.getSkuSelection();
    this.getSelection();
    this.getOutSelection();
    this.getCheckSelection();
    this.getlogiSelection();
    // this.rules.distributionTypeId[0].required = true;
  },

  data() {
    return {
      addFormRules: {
        warehousingId: [
          {
            required: true,
            message: "入库仓库为必选项",
            trigger: "blur",
          },
        ],
        countingTypeId: [
          {
            required: true,
            message: "入库仓库为必选项",
            trigger: "blur",
          },
        ],
      },
      logisSelect: [], //发货物流名称下拉
      checkTypes: [], //清点类型下拉
      //入库仓库表单
      addFormData: {
        warehousingId: undefined,
        countingTypeId: undefined,
      },

      //发出方拉下
      sendOuts: [],
      uploadExcelFlag: false,
      isRule: false,
      //   定义验证规则
      rules: {
        distributionTypeId: [
          {
            required: false,
            message: "发货物流名称为必选项",
            trigger: "blur",
          },
        ],
        shipperId: [
          {
            required: false,
            message: "发出方为必选项",
            trigger: "blur",
          },
        ],
        logisticsId: [
          {
            required: false,
            message: "入库方式为必选项",
            trigger: "blur",
          },
        ],
        expressNo: [
          {
            required: false,
            message: "发货物流单为必选项",
            trigger: "blur",
          },
        ],
        startTime: [
          {
            required: false,
            message: "发货时间为必选项",
            trigger: "change",
          },
        ],
        whtEndTime: [
          {
            required: false,
            message: "预计到仓时间为必选项",
            trigger: "change",
          },
        ],
        cargotankModel: [
          {
            required: false,
            message: "货柜型号需必填",
            trigger: "blur",
          },
        ],
        cargotankNumber: [
          {
            required: false,
            message: "货运柜号需必填",
            trigger: "blur",
          },
        ],
        hbl: [
          {
            required: false,
            message: "货运柜号需必填",
            trigger: "blur",
          },
        ],
        mbl: [
          {
            required: false,
            message: "货运柜号需必填",
            trigger: "blur",
          },
        ],
        cabinetTime: [
          {
            required: false,
            message: "要求还柜时间需必选",
            trigger: "change",
          },
        ],
      },
      viewBtnFlag: "",
      logiFileList: [],
      //模态框标杆
      modalFlage: "",
      refuseLogin: false,
      loading: false,
      fileList: [],
      baseUrl,
      passFlag: false,
      flightTime: null,
      endTime: null,
      styleBack: {
        border: "1px solid #f00",
        borderRadius: "5px",
      },
      styleYes: {
        border: "1px solid #e8e8e8",
        borderRadius: "5px",
      },
      //sku列表
      skuList: [],
      //快递选择
      express: [],
      //文件时上传请求头
      headers: {
        authorization: "authorization-text",
        ContentType: '["multipart/form-data"]',
        token: sessionStorage.getItem("tk"),
      },
      //到仓配送选择值
      dispatchingValue: [],
      // 到仓配送
      dispatchingOptions: [
        { label: "卡车配送", value: "0" },
        { label: "整柜派送", value: "1" },
        { label: "快递", value: "2" },
        { label: "仓库提货", value: "3" },
      ],
      // 模态框显示
      visible: false,
      //表格数据
      dataSource: [],
      boxlistObj: {
        boxNumber: "",
        createTime: "",
        customNo: "",
        fileUrl: "",
        frozenNumber: "",
        isEidit: true,
        isRemove: "",
        // key: 0,
        locationId: "",
        locationName: "",
        nuclide: true,
        outboundId: "",
        outboundNumber: "",
        singleBoxNumber: 1,
        productTag: "",
        remainingNumber: "",
        sku: "",
        skuId: "",
        skuName: "",
        updateTime: "",
        warehousingId: undefined,
        warehousingName: "",
      },
      dto: {
        id: "",
        boxlist: {
          boxNo: "",
          caratNumber: "",
          highNumber: "",
          inventory: true,
          lengthNumber: "",
          packingNumber: undefined,
          pto: [],
          wideNumber: "",
        },
        cargotankNumber: "",
        createTime: "",
        isTora: "1", //是否带托
        customNo: "",
        distributionType: "",
        fbaName: "",
        //要求还柜时间
        cabinetTime: null,
        fbaNumber: "",
        hbl: "",
        hullNumber: "",
        listingFee: "",
        logisticsId: undefined,
        logisticsName: "",
        mbl: "",
        shipper: "",
        shipperId: undefined,
        distributionTypeId: undefined,
        remark: "",
        startTime: null,
        whtEndTime: null,
        trayFee: "",
        trayNumber: "",
        unloadingFee: "",
        warehousingId: undefined,
        warehousingName: "",
        feeType: "",
        sinceFile: "",
        countingType: "",
        countingTypeId: "",
      },
    };
  },
  mounted() {
    //新增打开模态框
    this.$bus.$off("show");
    this.$bus.$on("show", () => {
      this.dto = {
        boxlist: {
          boxNo: "",
          caratNumber: "",
          highNumber: "",
          inventory: true,
          lengthNumber: "",
          packingNumber: undefined,
          pto: [],
          wideNumber: "",
        },
        cargotankNumber: "",
        createTime: "",
        isTora: "1", //是否带托
        customNo: "",
        distributionType: "",
        fbaName: "",
        //要求还柜时间
        cabinetTime: null,
        fbaNumber: "",
        hbl: "",
        hullNumber: "",
        listingFee: "",
        logisticsId: undefined,
        logisticsName: "",
        mbl: "",
        shipper: "",
        shipperId: undefined,
        distributionTypeId: undefined,
        remark: "",
        startTime: null,
        whtEndTime: null,
        trayFee: "",
        trayNumber: "",
        unloadingFee: "",
        warehousingId: undefined,
        warehousingName: "",
        feeType: "",
        sinceFile: "",
        countingType: "",
        countingTypeId: "",
      };
      this.fileList = [];
      this.dataSource = [];
      this.costValue = [];
      this.flightTime = null;
      this.visible = true;
      this.modalFlage = "add";
      this.logiFileList = [];
      this.addFormData.warehousingId = undefined;
      this.addFormData.countingTypeId = undefined;
    });
    //编辑、详情
    this.$bus.$off("RowDataUndertakes");
    this.$bus.$on("RowDataUndertakes", async (rowData, flag, viewBtnFlag) => {
      this.viewBtnFlag = viewBtnFlag;
      let { code, responseBody } = await getByApplyId(rowData.key);
      if (code === "200") {
        this.fileList = [];
        responseBody.logisticsId = !responseBody.logisticsId
          ? undefined
          : responseBody.logisticsId;
        this.flightTime = responseBody.deliveryTime;
        this.dataSource = responseBody.boxlist;
        this.addFormData.warehousingId = responseBody.warehousingId;
        this.addFormData.countingTypeId = responseBody.countingTypeId;
        this.dto = responseBody;
        this.dataSource.forEach((item) => {
          item.key = item.id;
        });

        this.costValue =
          this.dto.feeType === null || this.dto.feeType === ""
            ? []
            : this.dto.feeType.split(",");
        this.modalFlage = flag;
        this.visible = true;
      }
    });
  },
  methods: {
    //费用服务项信息查看
    costServiceInfo() {
      setTimeout(() => {
        if (this.dto.applyState === "100") {
          this.$bus.$emit("reappearance", this.dto, 2, this.dto.id, true);
        } else {
          this.$bus.$emit("reappearance", this.dto, 2, this.dto.id, false);
        }
      }, 50);
    },
    //发送账单
    sendBill() {
      this.loading = true;
      setTimeout(async () => {
        let { code } = await behalf_stock(this.dto.id);
        if (code === "10000") {
          this.getTabData();
          this.IsCheckTypeCount();
          this.loading = false;
          this.visible = false;
        }
      }, 1000);
    },

    //下载导出模板
    async upDowBtn() {
      let res = await upDow();
      const blob = new Blob([res], {
        type: "application/vnd.ms-excel",
      });
      const fileName = "入库申请批量导入模板.xlsx";
      const linkNode = document.createElement("a");
      linkNode.download = fileName; //a标签的download属性规定下载文件的名称
      linkNode.style.display = "none";
      linkNode.href = URL.createObjectURL(blob); //生成一个Blob URL
      document.body.appendChild(linkNode);
      linkNode.click(); //模拟在按钮上的一次鼠标单击
      URL.revokeObjectURL(linkNode.href); // 释放URL 对象
      document.body.removeChild(linkNode);
    },
    // 限制上传文件
    beforeUpload(file) {
      return new Promise((resolve, reject) => {
        this.files = file;
        const extension = file.name.split(".")[1] === "xls";
        const extension2 = file.name.split(".")[1] === "xlsx";
        if (!extension && !extension2) {
          this.$message.error("上传模板只能是 xls、xlsx格式!");
          return reject(false);
        }
        return resolve(true);
      });
    },
    // 限制上传文件
    beforeUploads(file) {
      return new Promise((resolve, reject) => {
        this.files = file;
        const isLt6M = file.size / 1024 / 1024 < 6;
        const pdf = file.type === "application/pdf";
        const img =
          file.type === "image/jpeg" ||
          file.type === "image/png" ||
          file.type === "image/jpg";
        if (!pdf && !img) {
          this.$message.error("上传文件只能是 png、jpeg、jpg、PDF!");
          return reject(false);
        }
        if (!isLt6M) {
          this.$message.error("文件大小限制小于6MB!");
          return reject(false);
        }
        return resolve(true);
      });
    },
    //验证发货物流名称
    checkFbaName(rule, value, callback) {
      if (this.dto.logisticsId === "201") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("发货物流名称不能为空"));
        } else {
          callback();
        }
      } else if (this.dto.logisticsId === "202") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("头程物流商不能为空"));
        } else {
          callback();
        }
      }
    },
    //验证发货物流名称
    checkFbaNumber(rule, value, callback) {
      if (this.dto.logisticsId === "201") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("发货物流单号不能为空"));
        } else {
          callback();
        }
      }
      if (this.dto.logisticsId === "202") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("头程物流号不能为空"));
        } else {
          callback();
        }
      }
    },
    //发货物流日期
    checkStartTime(rule, value, callback) {
      if (!value) {
        callback(new Error("发货时间需选择"));
      } else {
        callback();
      }
    },
    //货柜型号
    checkCargotankModel(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === undefined || value === null) {
          callback(new Error("货柜型号不能为空"));
        } else {
          callback();
        }
      }
    },
    //货柜船号
    checkHullNumber(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("货运船号不能为空"));
        } else {
          callback();
        }
      }
    },
    //货柜柜号
    checkCargotankNumber(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("货运柜号不能为空"));
        } else {
          callback();
        }
      }
    },
    //HBL
    checkHbl(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("HBL不能为空"));
        } else {
          callback();
        }
      }
    },
    //到仓日期
    checkEndTime(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === null) {
          callback(new Error("到仓日期不能为空"));
        } else {
          callback();
        }
      }
    },
    //MBL
    checkMbl(rule, value, callback) {
      if (this.dto.logisticsId === "203") {
        if (value === "" || value === null || value === undefined) {
          callback(new Error("MBL不能为空"));
        } else {
          callback();
        }
      }
    },
    //标签下载
    async tagDownload(data) {
      if (data.productTag === "") {
        this.$message.error("请选择SKU后进行下载操作！");
      } else {
        let res = await SKU_PDF6030(
          `top=${data.productTag}&&bottom=${data.sku}`
        );
        req.exportPDF("60*30mm", res);
      }
    },
    //发货日期日期改变
    changeExpressTime(date, dateString) {
      this.dto.startTime = dateString;
    },
    //要求还柜时间
    changeCabinetTime(date, dateString) {
      this.dto.cabinetTime = dateString;
    },
    //航班日期改变
    changeFlightTime(date, dateString) {
      this.dto.deliveryTime = dateString;
    },
    //预计到仓日期改变
    changeEndTime(date, dateString) {
      this.dto.whtEndTime = dateString;
    },
    // 仓库改变
    changeWarehouse(value, option) {
      this.dto.warehousingId = value;
      this.dto.warehousingName = option.data.attrs.name;
    },
    // 清点类型改变
    changeCountingType(value, option) {
      this.dto.countingTypeId = value;
      this.dto.countingType = option.data.attrs.name;
    },
    // 入库方式改
    changeDistributionType(value, option) {
      console.log(value);
      this.dto.distributionTypeId = value;
      this.dto.distributionType = option.data.attrs.name;
    },
    // 快递方式改
    changeLogisticsName(value, option) {
      this.dto.logisticsId = value;
      this.dto.logisticsName = option.data.attrs.name;
    },
    // 发出方改变
    changeSendOut(value, option) {
      this.dto.shipperId = value;
      this.dto.shipper = option.data.attrs.name;
    },
    //SKU改变
    changeSku(option, item, record) {
      let flag = true;
      record.pto.forEach((v) => {
        if (option.data.attrs.sku === v.sku) {
          flag = false;
          item.sku = "";
          this.$message.error("同一箱子只能不能添加多个同名SKU！");
        }
      });
      if (flag) {
        item.skuName = option.data.attrs.name;
        item.skuId = option.data.attrs.skuid;
        item.sku = option.data.attrs.sku;
        item.productTag = option.data.attrs.productTag;
      }
    },
    //新增每一行SKU
    addSku(record) {
      let rowDataPto = JSON.parse(JSON.stringify(record.pto));
      this.boxlistObj.key = Math.random();
      this.boxlistObj.skuId = "";
      this.boxlistObj.skuName = "";
      this.boxlistObj.sku = "请选择SKU";
      this.boxlistObj.singleBoxNumber = 1;
      rowDataPto.push(Object.assign({}, this.boxlistObj));
      this.dataSource.forEach((item, index) => {
        if (record.key === item.key) {
          this.dataSource[index].pto = rowDataPto;
        }
      });
    },
    //删除每一行SKU
    delSku(record, item) {
      record.pto.forEach((v, i) => {
        if (v.key === item.key) {
          if (record.pto.length === 1) {
            this.$message.error("每个箱子最少存放一个SKU！");
            return false;
          }
          record.pto.splice(i, 1);
        }
      });
    },
    //删除箱子每一行
    async onDelete(record, key) {
      this.dataSource.forEach((item, i) => {
        if (item.key === key) {
          this.dataSource.splice(i, 1);
        }
        this.dataSource[i].boxNo = i + 1;
      });
    },

    // 下拉框过滤
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    // 到仓配送
    changeDispatching(checkedValues) {
      if (!checkedValues.includes("3") && this.dto.sinceFile != "") {
        this.delFlie();
      }
      this.dispatchingValue = checkedValues;
      this.dto.distributionType = checkedValues.join(",");
    },
    //文件上传
    async handle(info) {
      this.logiFileList = [...info.fileList];
      if (info.file.status !== "uploading") {
        if (info.fileList.length >= 2) {
          this.fileList = info.fileList.concat();
          info.fileList = info.fileList.splice(0, 1);
          this.$message.warning("只能上传一个文件！");
        }
      }
      if (info.file.status === "done") {
        if (info.file.response.code === "200") {
          info.file.response.responseBody[0];
          this.dto.sinceFile = info.file.response.responseBody[0];
          console.log(this.logiFileList);
          this.dto.sinceFileText = info.file.name;
        }
        this.$message.success(`${info.file.name} 上传成功！`);
      } else if (info.file.status === "error") {
        this.$message.error(`${info.file.name} 上传失败！请重新试试！`);
      }

      if (info.file.status === "removed") {
        let { code } = await removefile(info.file.response.responseBody);
        if (code === "10000") {
          this.dto.sinceFile = "";
        }
      }
    },
    // 删除文件
    async delFlie() {
      let { code } = await removefile(this.dto.sinceFile.split(","));
      if (code === "10000") {
        this.logiFileList = [];
        this.dto.sinceFile = "";
      }
    },
    //获取入库方式下拉框选项
    async getSelection() {
      let res = await treeTagDictionary({
        tagType: 15,
      });
      if (res.code === "200") {
        this.express = res.responseBody;
      }
    },
    //获取发出方下拉框选项
    async getOutSelection() {
      let res = await treeTagDictionary({
        tagType: 16,
      });
      if (res.code === "200") {
        this.sendOuts = res.responseBody;
      }
    },
    //获取清点类型下拉框选项
    async getCheckSelection() {
      let res = await treeTagDictionary({
        tagType: 14,
      });
      if (res.code === "200") {
        this.checkTypes = res.responseBody;
      }
    },
    //获取sku下拉选项
    async getSkuSelection() {
      let value = await sku_select();
      if (value.code === "200") {
        this.skuList = value.responseBody;
      }
    },
    //获取发货物流名称下拉选项
    async getlogiSelection() {
      let res = await treeTagDictionary({
        tagType: 4,
      });
      if (res.code === "200") {
        this.logisSelect = res.responseBody;
      }
    },
    //关闭模态框
    cancel() {
      this.visible = false;
      setTimeout(() => {
        this.$refs.addForm.resetFields();
        this.$refs.ruleForm.resetFields();
      }, 100);
    },
    // 审核页面确认
    chcekBtn(flag) {
      if (flag === "pass") {
        this.loading = true;
        setTimeout(async () => {
          let { code } = await checkedByApplyInfo(this.dto.id, "0");
          if (code === "10000") {
            this.getTabData();
            this.IsCheckTypeCount();
            this.loading = false;
            this.visible = false;
          }
        }, 1000);
      } else if (flag === "reject") {
        this.refuseLogin = true;
        setTimeout(async () => {
          let { code } = await checkedByApplyInfo(this.dto.id, "1");
          if (code === "10000") {
            this.getTabData();
            this.IsCheckTypeCount();
            this.loading = false;
            this.visible = false;
          }
        }, 1000);
      }
    },
  },
  computed: {
    ...mapState(["clientWareHouse"]),
  },
};
</script>

<style lang="less" scoped>
/deep/.ant-table-header-column {
  width: 100% !important;
}
.ant-form-inline .ant-form-item-with-help {
  margin: 0;
}
/deep/.columns-tab {
  width: 10% !important;
  .columns {
    display: flex;
    div {
      // width: 100px;
      text-align: center;
      border: 1px solid #e8e8e8;
    }
    div:nth-child(2) {
      border-right: 0;
      border-left: 0;
    }
    div:nth-child(4) {
      border-right: 0;
      border-left: 0;
    }
  }
}
input {
  width: 6rem;
}
.row-btn {
  font-size: 18px;
  i {
    margin: 0 5px;
    cursor: pointer;
  }
}
/deep/.box-sizes {
  width: 22px;
  display: flex;
  input {
    width: 50px;
    flex: 1;
  }
}
.pto-list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  li {
    // flex: 1;
    border: 1px solid #e8e8e8;
    padding: 3px 0;
    // line-height: 2rem;
  }
  li:nth-child(2) {
    border-right: 0;
    border-left: 0;
  }
  li:nth-child(4) {
    border-right: 0;
    border-left: 0;
  }
}
/deep/.ant-modal-footer {
  text-align: center !important;
  button {
    margin: 0 50px;
  }
}
.logi-form {
  display: flex;
  flex-wrap: wrap;
  .ant-form-item {
    display: flex;
    width: 25%;
  }
  .upfile {
    width: 50%;
  }
}
</style>
